<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <meta name="format-detection" content="telephone=no"/>
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no"/>
    <style type="text/css">
        body, html {
            width: 100%;
            height: 100%;
            margin: 0;
            font-family: "微软雅黑";
        }

        #allmap {
            height: 100%;
            width: 100%;
        }

        #r-result {
            width: 100%;
        }

        about {
            background-color: rgba(255, 255, 255, 0);
            color: white;
            font-size: small;
            font-weight: bold;
        }
    </style>
    <script type="text/javascript"
            src="http://api.map.baidu.com/api?v=2.0&ak=kEFvRxLsZMP1LuappjehN0aA"></script>
    <title>台风路径模拟</title>
</head>
<body>


<div id="allmap" style="position: absolute; z-index: 1;"></div>
<div style="position: absolute; z-index: 2; left: 0px; top: 65%;">
    <img alt="tedst" src="tuli.png">
</div>


<script type="text/javascript">


    var jing = new Array();
    var wei = new Array();
    var infoWindow = new Array();

    //百度地图API功能
    var map = new BMap.Map("allmap", {mapType: BMAP_HYBRID_MAP});

    crflag = 0;

    //链接数据库
    <?php

    $config = parse_ini_file("config/db_config.ini");
    $server = $config["server"];
    $username = $config["username"];
    $password = $config["password"];
    $database = $config["database"];
    $link = mysqli_connect($server, $username, $password, $database);
    $tempn = $_GET ['num'];

    $n = explode(";", $tempn);

    $size = count($n);
    $no = 0;
    $flag = 0;

    $table = $_GET ['table'];

    $cnt = $_GET['count'];
    $cntA = explode(";", $cnt);
    $cntNum = 0;

    while ( $no < $size ) {

    $flag++;
    $sql = "SELECT `long`,lat,level,`date`,hour,pres,speed_last FROM " . $table . " where flat=0 and num='" . $n [$no] . "' ORDER BY no ASC";
    $result = mysqli_query($link, $sql);
    //	echo "alert($sql)\n";
    //    $result = mysql_db_query($database, $sql);
    $row = mysqli_fetch_row($result);


    $aboutSQL = "SELECT num,name,level,date,count FROM typhoon_total WHERE num = '" . $n [$no] . "'";
    $aboutRes = mysqli_query($link, $aboutSQL);
    $aboutFetch = mysqli_fetch_row($aboutRes);

    if (!($table == 'typhoon_forecast'))
        $count = $aboutFetch [4];
    else
        $count = $cntA[$cntNum++];



    ?>
    jingh = <?php echo $row[0]?>;
    weih = <?php echo $row[1]?>;


    var aboutNum = <?php echo $aboutFetch[0]?>;
    var aboutName = <?php echo "\"" . $aboutFetch[1] . "\"" ?>;
    var aboutLevel = <?php echo $aboutFetch[2]?>;
    var aboutTime = <?php echo $aboutFetch[3]?>;

    var array = new Array();


    var point = new BMap.Point(jingh, weih); // 创建点坐标

    map.centerAndZoom(point, 5); // 初始化地图，设置中心点坐标和地图级别

    //map.addControl(new BMap.NavigationControl());
    map.addControl(new BMap.ScaleControl());


    if (!crflag) {
        var cr = new BMap.CopyrightControl({anchor: BMAP_ANCHOR_TOP_RIGHT});   //设置版权控件位置
        map.addControl(cr); //添加版权控件
        crflag = 1;
    }

    var bs = map.getBounds();   //返回地图可视区域


    switch (aboutLevel) {
        case 0 :
        <?php if($table == 'typhoon_forecast'){?>
            aboutLevel = "正在发生";
        <?php }else{?>
            aboutLevel = "弱于热带低压";
        <?php }?>

            break;
        case 1 :
            aboutLevel = "热带低压";
            break;
        case 2 :
            aboutLevel = "热带风暴";
            break;
        case 3 :
            aboutLevel = "强热带风暴";
            break;
        case 4 :
            aboutLevel = "台风";
            break;
        case 5 :
            aboutLevel = "强台风";
            break;
        case 6 :
            aboutLevel = "超强台风";
            break;
        case 9 :
            aboutLevel = "强于超强台风";
            break;
        default :
            aboutLevel = "(预测点)";
            break;
    }


    cr.addCopyright({
        id: 1,
        content: "<about>序号：" + aboutNum + "<br>名称：" + aboutName + "<br>等级：" + aboutLevel + "<br>时间：" + parseInt(aboutTime / 1000000) + "." + parseInt((aboutTime % 1000000) / 10000) + "." + parseInt((aboutTime % 10000) / 100) + "</about>",
        bounds: bs
    });


    // 	载入台风图标
    var redIcon = new BMap.Icon("icon_typhoon1.gif", new BMap.Size(20, 20), {
        offset: new BMap.Size(0, 0), // 指定定位位置
        imageOffset: new BMap.Size(0, 0) // 设置图片偏移
    });
    var orangeIcon = new BMap.Icon("icon_typhoon2.gif", new BMap.Size(20, 20), {
        offset: new BMap.Size(0, 0), // 指定定位位置
        imageOffset: new BMap.Size(0, 0) // 设置图片偏移
    });
    var yellowIcon = new BMap.Icon("icon_typhoon3.gif", new BMap.Size(20, 20), {
        offset: new BMap.Size(0, 0), // 指定定位位置
        imageOffset: new BMap.Size(0, 0) // 设置图片偏移
    });
    var blueIcon = new BMap.Icon("icon_typhoon4.gif", new BMap.Size(20, 20), {
        offset: new BMap.Size(0, 0), // 指定定位位置
        imageOffset: new BMap.Size(0, 0) // 设置图片偏移
    });
    var forecastIcon = new BMap.Icon("icon_typhoon9.png", new BMap.Size(20, 20), {
        offset: new BMap.Size(0, 0), // 指定定位位置
        imageOffset: new BMap.Size(0, 0) // 设置图片偏移
    });


    var marker = new Array();
    var pointArr = new Array();
    var levelArr = new Array();
    var time = new Array();
    var hour = new Array();
    var pres = new Array();
    var sp = new Array();
    var polyline;
    var tempIcon;



    <?php

    $i = 0;
    for (; $i < $count; $i++) {
        $tempLv = "null";

        switch ($row [2]) {
            case '0' :
                $tempLv = "弱于热带低压";
                echo "tempIcon = blueIcon;";
                break;
            case '1' :
                $tempLv = "热带低压";
                echo "tempIcon = blueIcon;";
                break;
            case '2' :
                $tempLv = "热带风暴";
                echo "tempIcon = yellowIcon;";
                break;
            case '3' :
                $tempLv = "强热带风暴";
                echo "tempIcon = yellowIcon;";
                break;
            case '4' :
                $tempLv = "台风";
                echo "tempIcon = orangeIcon;";
                break;
            case '5' :
                $tempLv = "强台风";
                echo "tempIcon = orangeIcon;";
                break;
            case '6' :
                $tempLv = "超强台风";
                echo "tempIcon = redIcon;";
                break;
            case '9' :
                $tempLv = "强于超强台风";
                echo "tempIcon = redIcon;";
                break;
            default :
                $tempLv = "(预测点)";
                echo "tempIcon = forecastIcon;";
                break;
        }
        echo "jing[" . $i . "]=" . $row [0] . ";";
        echo "wei[" . $i . "]=" . $row [1] . ";";
        echo "hour[" . $i . "]=" . $row [4] . ";";
        echo "pres[" . $i . "]=" . $row [5] . ";";
        echo "sp[" . $i . "]=" . $row [6] . ";";
        echo "time[" . $i . "]=\"" . substr($row[3], 0, 4) . "年" . substr($row[3], 5, 2) . "月" . substr($row[3], 8, 2) . "日" . $row[4] . "时\";";
        echo "levelArr[" . $i . "]=\"" . $tempLv . "\";";
        echo "pointArr[" . $i . "] = new BMap.Point(jing[" . $i . "],wei[" . $i . "]); 
	    marker[" . $i . "]=new BMap.Marker(pointArr[" . $i . "],{icon:tempIcon});
		
		map.addOverlay( marker[" . $i . "]);
		polyline = new BMap.Polyline([    
   		point,    
   		pointArr[" . $i . "]   
 		], 
 		{strokeColor:\"red\", strokeWeight:3, strokeOpacity:0.5}    
		);
		map.addOverlay(polyline);
		point=pointArr[" . $i . "];
				
		var opts = {
	 	width : 200,     // 信息窗口宽度
	  	height: 105,     // 信息窗口高度
	  	enableMessage:true,//设置允许信息窗发送短息
	 	message:\"这里是滨江学院台风订阅号发送的台风点信息\"
		}
		infoWindow[" . $i . "] = new BMap.InfoWindow(\"位置：\" + jing[" . $i . "] + \"°E,\" + wei[" . $i . "]+\"°N<br>强度：\"+levelArr[" . $i . "]+\"<br>时间：\"+time[" . $i . "]+\"<br>中心气压：\"+pres[" . $i . "]+\" hPa\"+\"<br>平均风速：\"+sp[" . $i . "]+\" m/s\", opts);  // 创建信息窗口对象 
		marker[" . $i . "].addEventListener(\"click\", function(){          
		map.openInfoWindow(infoWindow[" . $i . "],pointArr[" . $i . "]); //开启信息窗口
		});
		
		";
        $row = mysqli_fetch_row($result);
    }

    $no = $no + 1;
    }

    ?>

    polyline = new BMap.Polyline([
            point,
            pointArr[$i]
        ],
        {strokeColor: "red", strokeWeight: 3, strokeOpacity: 0.5}
    );

    map.addOverlay(polyline);


</script>
</body>
</html>
